// pc
function pcGSAPAnimateInit() {
  // kv Begin
  // /*

  // */
  // kv End

  // trophy Begin
  // /*
  new Swiper(".one-trophy-swiper", {
    noSwipingClass: "one-trophy-swiper",
    centeredSlides: true,
    centeredSlidesBounds: true,
    loop: true,
    spaceBetween: 20,
    loopAdditionalSlides: 2,
    autoplay: {
      delay: 1500, // 设置轮播的延迟时间
      disableOnInteraction: true,
    },
    on: {
      slideChangeTransitionStart: function () {
        $(".one-trophy-swiper-item").removeClass("active");
        $(".one-trophy-swiper-item").eq(this.activeIndex).addClass("active");
      },
    },
    navigation: {
      prevEl: ".one-trophy-swiperList .one-trophy-left",
      nextEl: ".one-trophy-swiperList .one-trophy-right",
      disabledClass: "disabled",
    },
  });
  // */
  // trophy End

  // style begin
    var styleVideo1 = $(".one-style-vedio > .video1")[0]
    var styleVideo2 = $(".one-style-vedio > .video2")[0]
    var flag = false

    ScrollTrigger.create({
        id: "styleVideo",
        trigger: ".one-style-section",
        start: "top top",
        end: "50%",
        pin: true,
    })

    ScrollTrigger.create({
        id: "styleVideo",
        trigger: ".one-style-section-top",
        start: "top top",
        end: "-=10",
        scrub: true,
        animation: gsap.timeline().to(".one-style-section",{
            onStart: function () {
                if (!flag){
                    styleVideo1.currentTime = 0;
                    styleVideo1.play()
                    styleVideo1.onended = () => {
                        styleVideo1.style.display = "none";
                        styleVideo2.play()
                        flag = true
                    }
                } else {
                    styleVideo2.currentTime = 0;
                    styleVideo2.play()
                }
            },
            onReverseComplete: function () {
                styleVideo1.style.display = "block";
                styleVideo1.currentTime = 0;
                styleVideo1.pause()
                styleVideo2.pause()
                flag = false
            }
        })
    });

  //   style end

  //   cansee begin
    ScrollTrigger.create({
        trigger: ".one-cansee-section",
        start: "top 30%",
        end: "+=300",
        scrub: true,
        animation: gsap.timeline()
            .fromTo(".one-cansee-txt .left", { right: "100vw" }, { right: "0"})
    });
    ScrollTrigger.create({
        trigger: ".one-cansee-section",
        start: "top 30%",
        end: "+=300",
        scrub: true,
        animation: gsap.timeline()
            .fromTo(".one-cansee-txt .right", { left: "100vw" }, { left: "0"})
    });
    ScrollTrigger.create({
        trigger: ".one-cansee-section",
        start: "top 30%",
        end: "+=300",
        scrub: true,
        animation: gsap.timeline()
            .fromTo(".one-cansee-txt .bottom", { top: "30vh" }, { top: "0"})
    });

    var canseeVideo = $(".one-cansee-video>video")[0]
    ScrollTrigger.create({
        id: "canseeVideo",
        trigger: ".one-cansee-section-top",
        start: "top top",
        end: "-=10",
        scrub: true,
        animation: gsap.timeline().to(".one-cansee-video",{
            onStart: function () {
                canseeVideo.currentTime = 0;
                canseeVideo.play()
            },
            onReverseComplete: function () {
                canseeVideo.currentTime = 0;
            }
        })
    });
    //   style end
  //   cansee end

  // capture Begin
  // /*
  new Swiper(".one-capture-swiper", {
    spaceBetween: 30,
    autoplay: {
      delay: 5000, // 设置轮播的延迟时间
      disableOnInteraction: true,
    },
    on: {
      slideChange: function () {
        $(".one-capture-btn").removeClass("active");
        $(".one-capture-btn").eq(this.activeIndex).addClass("active");
      },
    },
		pagination: {
			type: "custom",
			clickable: true,
			el: ".one-capture-btnBox",
			bulletClass: "one-capture-btn",
		},
  });
  // */
  // capture End

  //   camera begin
    var cameraVideo = $(".one-camera-vedio>video")[0]

    ScrollTrigger.create({
        id: "styleVideo",
        trigger: ".one-camera-section-top",
        start: "top top",
        end: "-=10",
        scrub: true,
        animation: gsap.timeline().to(".one-camera-section",{
            onStart: function () {
                cameraVideo.currentTime = 0;
                cameraVideo.play()
            },
            onReverseComplete: function () {
                cameraVideo.currentTime = 0;
            }
        })
    });
  //   camera end

  //   single begin

  // ar Begin
    var arVideo = $(".one-ar-vedio")[0]

    ScrollTrigger.create({
        trigger: ".one-ar-section",
        start: "top top",
        end: "50%",
        pin: true,
    })

    $(".one-ar-desc")[0].style.opacity = "0";
    ScrollTrigger.create({
        id: "arVideo",
        trigger: ".one-ar-section-top",
        start: "top top",
        end: "top top",
        scrub: true,
        animation: gsap.timeline().to(".one-ar-section",{
           onStart:  () => {
               arVideo.currentTime = 0;
               arVideo.play()
               arVideo.onended = () => {
                   $(".one-ar-desc")[0].style.opacity = "1";
               }
           },
            onReverseComplete: () => {
               arVideo.currentTime = 0;
               arVideo.pause()
                $(".one-ar-desc")[0].style.opacity = "0";
            }
        })
    });
  // ar End


  // interaction Begin
  // /*
  new Swiper(".one-interaction-swiper", {
    spaceBetween: 30,
    autoplay: {
      delay: 5000, // 设置轮播的延迟时间
      disableOnInteraction: true,
    },
    on: {
      slideChange: function () {
        $(".one-interaction-btn").removeClass("active");
        $(".one-interaction-btn").eq(this.activeIndex).addClass("active");
      },
    },
		pagination: {
			type: "custom",
			clickable: true,
			el: ".one-interaction-btnBox",
			bulletClass: "one-interaction-btn",
		},
  });
  // */
  // interaction End

  // weight Begin
  // /*
	ScrollTrigger.create({
		trigger: ".one-weight-section",
		start: "top 50%",
		end: "+=500",
		scrub: true,
		animation: gsap.timeline()
			.fromTo(".one-weight-img", { marginLeft: "100vw", marginTop: "100vh", scale: 0.3 }, { marginLeft: "1.5vw", marginTop: "-5.5vh", scale: 0.88 })
	});
	ScrollTrigger.create({
		trigger: ".one-weight-section",
		start: "top 50%",
		end: "+=500",
		scrub: true,
		animation: gsap.timeline()
			.fromTo(".one-weight-img", { opacity: 0 }, { opacity: 1 })
	});
  // */
  // weight End

  // detail Begin
  // /*
  new Swiper(".one-detail-swiper", {
    spaceBetween: 30,
    autoplay: {
      delay: 5000, // 设置轮播的延迟时间
      disableOndetail: true,
    },
    on: {
      slideChange: function () {
        $(".one-detail-btn").removeClass("active");
        $(".one-detail-btn").eq(this.activeIndex).addClass("active");
      },
    },
		pagination: {
			type: "custom",
			clickable: true,
			el: ".one-detail-btnBox",
			bulletClass: "one-detail-btn",
		},
  });
  // */
  // detail End

}

$(".one-form-button1").click(function() {
  const form = $("#one-contact_form1");
  const formData = {data: {}};
  if(!form.serializeArray()[0].value) {
    alert(`${form.data("inputerror")}`)
    return;
  }
  formData.data[form.serializeArray()[0].name] = form.serializeArray()[0].value;

   $.ajax({
		type: "POST",
    headers: {
      'Content-Type': 'application/json',
    },
    url: form.data("action"),
    data: JSON.stringify(formData),
    success: function (t) {
      window.confirm(form.data("postsuccess"));
      $("#one-contact_form")[0].reset();
    },
    error: function () {
        window.confirm(form.data("posterror"));
    },
  });
})

$(".one-form-button2").click(function() {
    const form = $("#one-contact_form2");
    const formData = {data: {}};
    if(!form.serializeArray()[0].value) {
        alert(`${form.data("inputerror")}`)
        return;
    }
    formData.data[form.serializeArray()[0].name] = form.serializeArray()[0].value;

    $.ajax({
        type: "POST",
        headers: {
            'Content-Type': 'application/json',
        },
        url: form.data("action"),
        data: JSON.stringify(formData),
        success: function (t) {
            window.confirm(form.data("postsuccess"));
            $("#one-contact_form")[0].reset();
        },
        error: function () {
            window.confirm(form.data("posterror"));
        },
    });
})

$(".one-form-button3").click(function() {
    const form = $("#one-contact_form3");
    const formData = {data: {}};
    if(!form.serializeArray()[0].value) {
        alert(`${form.data("inputerror")}`)
        return;
    }
    formData.data[form.serializeArray()[0].name] = form.serializeArray()[0].value;

    $.ajax({
        type: "POST",
        headers: {
            'Content-Type': 'application/json',
        },
        url: form.data("action"),
        data: JSON.stringify(formData),
        success: function (t) {
            window.confirm(form.data("postsuccess"));
            $("#one-contact_form")[0].reset();
        },
        error: function () {
            window.confirm(form.data("posterror"));
        },
    });
})

// wap
function wapGSAPAnimateInit() {
  // kv Begin
  var kvAnimate;
  window.ONE.keyAnimate(
    ".one-kv-video",
    1,
    226,
    18,
    ".png.webp",
  ).then(function (re) {
    kvAnimate = re;
    kvAnimate?.from(1);
  });
  // kv End

  // trophy Begin
  // /*
  var trophySwiper = new Swiper(".one-trophy-swiper", {
    centeredSlides: true,
    centeredSlidesBounds: true,
    loop: true,
    spaceBetween: 24,
    autoplay: {
      delay: 1500, // 设置轮播的延迟时间
      disableOnInteraction: true,
    },
    on: {
      slideChangeTransitionStart: function () {
        $(".one-trophy-swiper-item").removeClass("active");
        $(".one-trophy-swiper-item").eq(this.activeIndex).addClass("active");
      },
    },
  });
  // */
  // trophy End

  // style begin
  var styleKeyAnimate;
  var styleFlag = false;

  window.ONE.keyAnimate(
    ".one-style-video",
    1,
    247,
    18,
    ".png.webp",
  ).then(function (re) {
    styleKeyAnimate = re;
  });

  // 序列帧播放完成回调
  var styleCallBack = () => {
    styleKeyAnimate?.from(27);
  }

  ScrollTrigger.create({
    trigger: ".one-style-video",
    start: "top 30%",
    scrub: true,
    animation: gsap.timeline().to(".one-style-video", {
      onStart: function () {
        console.log("onStart");
        styleKeyAnimate?.from(1, 1, styleCallBack);
      },
      onReverseComplete: function () {
        styleKeyAnimate?.from(1)
        styleKeyAnimate?.stop();
      }
    })
  });
  // style end

  // cansee begin
  ScrollTrigger.create({
    trigger: ".one-cansee-section",
    start: "top 70%",
    end: "+=300",
    scrub: true,
    animation: gsap.timeline()
      .fromTo(".one-cansee-txt .left", { right: "100vw" }, { right: "0" })
  });
  ScrollTrigger.create({
    trigger: ".one-cansee-section",
    start: "top 70%",
    end: "+=300",
    scrub: true,
    animation: gsap.timeline()
      .fromTo(".one-cansee-txt .right", { left: "100vw" }, { left: "0" })
  });
  ScrollTrigger.create({
    trigger: ".one-cansee-section",
    start: "top 70%",
    end: "+=300",
    scrub: true,
    animation: gsap.timeline()
      .fromTo(".one-cansee-txt .bottom", { top: "30vh" }, { top: "0" })
  });
  //   cansee end

  // cansee1 begin
  var canseeKeyAnimate;
  window.ONE.keyAnimate(
    ".one-cansee-wap-video",
    1,
    105,
    18,
    ".png.webp",
  ).then(function (re) {
    canseeKeyAnimate = re;
  })
  ScrollTrigger.create({
    trigger: ".one-cansee-wap-video",
    start: "top 60%",
    scrub: true,
    animation: gsap.timeline().to(".one-cansee-wap-video", {
      onStart: function () {
        canseeKeyAnimate?.from(1);
      },
    })
  });
  // cansee1 end

  // camera begin
  var cameraKeyAnimate;
  window.ONE.keyAnimate(
    ".one-camera-video",
    1,
    200,
    18,
    ".png.webp",
  ).then(function (re) {
    cameraKeyAnimate = re;
  })
  ScrollTrigger.create({
    trigger: ".one-camera-video",
    start: "top 40%",
    scrub: true,
    animation: gsap.timeline().to(".one-camera-video", {
      onStart: function () {
        cameraKeyAnimate?.from(1);
      },
    })
  });
  // camera end

  // capture Begin
  // /*
  var beforeIndex = 0
  var curPosition = 0

  var captureList = $(".one-capture-btn");

  $(".bottom-line").css({
    width: captureList[0].clientWidth,
    left: captureList[0].offsetLeft,
  });

  let captureLineWidth = 0

  for (let index = 0; index < captureList.length; index++) {
    captureLineWidth += captureList[index].clientWidth;
  }
  captureLineWidth += (captureList.length - 1) * 30
  console.log(captureLineWidth + (captureList.length - 1) * 30)

  $(".one-capture-btnBox-line").css({ width: captureLineWidth })

  var curBtn = $(".one-capture-btn").eq("0").addClass("active");
  $(".one-capture-txt p").eq("0").addClass("active");
  const capture = new Swiper(".one-capture-swiper", {
    autoplay: {
      delay: 5000,
      disableOnInteraction: true,
    },
    spaceBetween: 10,
    on: {
      slideChangeTransitionStart: function () {
        $(".one-capture-btn")
          .removeClass("active")
          .eq(this.activeIndex)
          .addClass("active");
        $(".one-capture-txt>p")
          .removeClass("active")
          .eq(this.activeIndex)
          .addClass("active");
        curPosition = 0;
        for (let i = 0; i < this.activeIndex; i++) {
          curPosition += captureList[i].offsetLeft
        }
        document.querySelector(".one-capture-btnBox")
          .scrollTo({ left: curPosition });
        beforeIndex = this.activeIndex

        $(".bottom-line").css({
          width: captureList[this.activeIndex].clientWidth,
          left: captureList[this.activeIndex].offsetLeft,
        });

      },
    },
  });
  document
    .querySelector(".one-capture-btnBox")
    .addEventListener("click", function (e) {
      const btn = e.target.closest(".one-capture-btn");
      if (btn) {
        const index = [...btn.parentNode.children].indexOf(btn);
        capture.slideTo(index);
      }
    });
  // */
  // capture End


  //single begin
  $(".one-single-paramBox").removeClass('showA')
  //single end

  // ar begin
  var arKeyAnimate, arTimer;
  window.ONE.keyAnimate(
    ".one-ar-video",
    1,
    30,
    18,
    ".png.webp",
  ).then(function (re) {
    arKeyAnimate = re;
  });

  ScrollTrigger.create({
    trigger: ".one-ar-video",
    start: "top 40%",
    scrub: true,
    animation: gsap.timeline().to(".one-ar-video", {
      onStart: function () {
        arKeyAnimate?.from(1, 1);
        arTimer = setTimeout(function () {
          $(".one-ar-desc")[0].style.opacity = "1"
          clearTimeout(arTimer);
        }, 1660)
      },
      onReverseComplete: function () {
        clearTimeout(arTimer);
        $(".one-ar-desc")[0].style.opacity = "0"
        arKeyAnimate.stop();
      }
    })
  });
  // ar end

  // interaction Begin
  // /*
  var beforeIndex = 0
  var curPosition = 0

  var interactionList = $(".one-interaction-btn");

  $(".interaction-bottom-line").css({
    width: interactionList[0].clientWidth,
    left: interactionList[0].offsetLeft,
  });

  let interactionLineWidth = 0

  for (let index = 0; index < interactionList.length; index++) {
    interactionLineWidth += interactionList[index].clientWidth;
  }
  interactionLineWidth += (interactionList.length - 1) * 12
  console.log(interactionLineWidth + (interactionList.length - 1) * 12)

  $(".one-interaction-btnBox-line").css({ width: interactionLineWidth })

  var curBtn = $(".one-interaction-btn").eq("0").addClass("active");
  $(".one-interaction-txt p").eq("0").addClass("active");
  const interaction = new Swiper(".one-interaction-swiper", {
    autoplay: {
      delay: 5000,
      disableOnInteraction: true,
    },
    spaceBetween: 10,
    on: {
      slideChangeTransitionStart: function () {
        $(".one-interaction-btn")
          .removeClass("active")
          .eq(this.activeIndex)
          .addClass("active");
        $(".one-interaction-txt>p")
          .removeClass("active")
          .eq(this.activeIndex)
          .addClass("active");
        curPosition = 0;

        for (let i = 0; i < this.activeIndex; i++) {
          curPosition += interactionList[i].offsetLeft
        }

        document.querySelector(".one-interaction-btnBox")
          .scrollTo({ left: curPosition });
        beforeIndex = this.activeIndex

        $(".interaction-bottom-line").css({
          width: interactionList[this.activeIndex].clientWidth,
          left: interactionList[this.activeIndex].offsetLeft,
        });

      },
    },
  });
  document
    .querySelector(".one-interaction-btnBox")
    .addEventListener("click", function (e) {
      const btn = e.target.closest(".one-interaction-btn");
      if (btn) {
        const index = [...btn.parentNode.children].indexOf(btn);
        interaction.slideTo(index);
      }
    });
  // */
  // interaction End

  // weight Begin
  // /*
  ScrollTrigger.create({
    trigger: ".one-weight-section",
    start: "top 50%",
    end: "+=300",
    scrub: true,
    animation: gsap.timeline()
      .fromTo(".one-weight-img", { left: "100vw", top: "100vh", scale: 0.3 }, { left: "0", top: "0", scale: 1, duration: 1000 }),
  });
  ScrollTrigger.create({
    trigger: ".one-weight-section",
    start: "top 50%",
    end: "+=300",
    scrub: true,
    animation: gsap.timeline()
      .fromTo(".one-weight-img", { opacity: 0 }, { opacity: 1 })
  });
  // */
  // weight End

  // detail Begin
  // /*
  var detailList = $(".one-detail-btn");

  $(".detail-bottom-line").css({
    width: detailList[0].clientWidth,
    left: detailList[0].offsetLeft,
  });

  let detailLineWidth = 0

  for (let index = 0; index < detailList.length; index++) {
    detailLineWidth += detailList[index].clientWidth;
  }
  detailLineWidth += (detailList.length - 1) * 28
  console.log(detailLineWidth + (detailList.length - 1) * 28)

  $(".one-detail-btnBox-line").css({ width: detailLineWidth })

  var beforeIndex = 0
  var curPosition = 0
  var curBtn = $(".one-detail-btn").eq("0").addClass("active");
  $(".one-detail-txt p").eq("0").addClass("active");
  const detail = new Swiper(".one-detail-swiper", {
    autoplay: {
      delay: 5000,
      disableOnInteraction: true,
    },
    spaceBetween: 10,
    on: {
      slideChangeTransitionStart: function () {
        $(".one-detail-btn")
          .removeClass("active")
          .eq(this.activeIndex)
          .addClass("active");
        $(".one-detail-txt>p")
          .removeClass("active")
          .eq(this.activeIndex)
          .addClass("active");

        curPosition = 0

        for (let i = 0; i < this.activeIndex; i++) {
          curPosition += detailList[i].offsetLeft
        }

        document.querySelector(".one-detail-btnBox")
          .scrollTo({ left: curPosition });
        beforeIndex = this.activeIndex

        $(".detail-bottom-line").css({
          width: detailList[this.activeIndex].clientWidth,
          left: detailList[this.activeIndex].offsetLeft,
        });

      },
    },
  });
  document
    .querySelector(".one-detail-btnBox")
    .addEventListener("click", function (e) {
      const btn = e.target.closest(".one-detail-btn");
      if (btn) {
        const index = [...btn.parentNode.children].indexOf(btn);
        detail.slideTo(index);
      }
    });
  // */
  // detail End

}
